// =============================================================================
// SCSS/SITE/STACKS/INTEGRITY/_BREADCRUMBS.SCSS
// -----------------------------------------------------------------------------
// Styling for breadcrumb navigation to show users where they are within the
// site. Not intended for primary navigation. Keep their use succinct.
// =============================================================================

// =============================================================================
// TABLE OF CONTENTS
// -----------------------------------------------------------------------------
//   01. Base Styles
// =============================================================================

// Base Styles
// =============================================================================

.x-breadcrumb-wrap {
  margin: 0;
  border-bottom: 1px solid $breadcrumbBorderBottom;
  padding: 1.05em 0;
  @include font-size(1.0);
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1.4;
  text-shadow: $breadcrumbTextShadow;
  text-transform: uppercase;
  background-color: $breadcrumbBackground;
  @include box-shadow(#{0 1px 0 0 $breadcrumbBoxShadow});

  a {
    color: lighten($textColor, 25%);

    &:hover {
      color: $linkColor;
    }
  }
}

.x-breadcrumbs {
  float: left;
  width: 85%;
  @include break(middle-bear) {
    float: none;
    width: 100%;
    text-align: center;
  }

  .delimiter {
    margin: 0 0.25em 0 0.45em;
    color: lighten($textColor, 25%);
  }

  .current {
    color: $headingsColor;
  }
}